$(function () {

    var arr = [];
    //console.log($(".ins"));


    //11.按键增加表格元素
   /* $(".btn").on("click",function() {
        //遍历ins数组
        $.each($(".ins"),function (i,d) {
            arr[i] = $(d).val();
        });
        //console.log(arr);
            //把新创建的元素放在table的最后面
            $(".tab").append("<tr><td><input type='checkbox' class='ck'></td><td>"+arr[0]+"</td><td>"+arr[1]+"</td><td class='danjia'>"+arr[2]+"</td><td><a href='javascript:;' class='reduce'>-</a><input type='text' class='number' value='"+arr[3]+"'><a href='javascript:;' class='add'>+</a></td><td>"+arr[4]+"</td><td class='del'><a href='javascript:;'>删除</a></td></tr>");

    });*/

//事件委派型
    $(".btn").on("click",function(){

        //console.log($(this));
       $(".tab").append("<tr><td><input type='checkbox' class='ck'></td><td>"+$(this).siblings(".name").val()+"</td><td>"+$(this).siblings(".item").val()+"</td><td class='danjia'>"+$(this).siblings(".cost").val()+"</td><td><a href='javascript:;' class='reduce'>-</a><input type='text' class='number' value='"+$(this).siblings(".number").val()+"'><a href='javascript:;' class='add'>+</a></td><td>"+$(this).siblings(".total").val()+"</td><td class='del'><a href='javascript:;'>删除</a></td></tr>") ;
    });



    //1.全选 change
    $(".all").change(function () {
        //把全选框的check值赋给全部小ck
        

        //获取原有属性 jq对象.prop("属性名","属性值");
        //获取自定义属性 .jq对象.attr("属性名","属性值");
        //自定义属性即添加原来没有的属性

        //如 <input index="1" type="text"> index并不是原有属性
       $(".ck").prop("checked",$(".all").prop("checked"));


        //10. 加背景颜色
        if ($(".all").prop("checked")){//全选框被选中，全部加背景颜色
            $(".ck").parent().parent().addClass("active");
        }else {
            $(".ck").parent().parent().removeClass("active");
        }


    });//prop() 方法设置或返回被选元素的属性和值。

    //当该方法用于返回属性值时，则返回第一个匹配元素的值。

//当该方法用于设置属性值时，则为匹配元素集合设置一个或多个属性/值对。

    //2.根据全部小ck的check值判断全选框的check值

    $(".ck").change(function () {
        console.log($(".ck:checked"));//遍历所有的ck的check属性
        // 如果某一ck的check值为true，放入伪数组中
        if ($(".ck:checked").length===($(".ck").length)) {
            //所以，根据伪数组的数组长度便可知道全部小ck的check值的情况
            $(".all").prop("checked",true);
        }else {
            $(".all").prop("checked",false);
        }

        //若单行被选中，加背景颜色
        if($(this).prop("checked")){
            $(this).parent().parent().addClass("active");
        }else {
            $(this).parent().parent().removeClass("active");
        }

    });

    //3. 数量增加
    $(".add").click(function () {
        var num = $(this).siblings(".number").val();
        num++;
        $(this).siblings(".number").val(num);
        //4.计算总价
        //获取单价
         var danjia=$(this).parent().siblings(".danjia").text().slice(1);
         console.log(danjia);
         danjia = (danjia*num).toFixed(2);//保留两位小数
        //找到父亲的兄弟，把计算好的数给他
        $(this).parent().siblings(".total").text("￥"+danjia);
        getSum();//当数量增加时要调用计算总价总数目的函数
    });

//4.数量减少
    $(".reduce").click(function () {
        var num = $(this).siblings(".number").val();
        if (num==1){
            return;//结束方法
        }
            num--;

        $(this).siblings(".number").val(num);
        //4.计算总价
        //获取单价
        var danjia=$(this).parent().siblings(".danjia").text().slice(1);
        console.log(danjia);
        danjia = (danjia*num).toFixed(2);//保留两位小数
        //找到父亲的兄弟，把计算好的数给他
        $(this).parent().siblings(".total").text("￥"+danjia);
        //当数量减少时要调用计算总价总数目的函数
    });

    //6.当文本框的值发生改变后计算总价
    $(".number").change(function () {
        //获取文本框的值
       var num = $(this).val();
        console.log(num);
        //获取单价
        var danjia=$(this).parent().siblings(".danjia").text().slice(1);
        //单价乘num
        var total =(danjia*num).toFixed(2);//保留两位小数
        //把值存到总价里
        $(this).parent().siblings(".total").text("￥"+total);
        getSum();//当文本框的值发生变化时要调用计算总价总数目的函数
    });

    getSum();//先调用一遍，计算目前的订单总价和订单总和

//6.计算订单总和和价钱总和
      function getSum() {
        var count = 0;//总数
        var totalMoney = 0;//总价
        //遍历数量框
          $(".number").each(function (index,ele) {
              count += +($(ele).val());

          });
          $(".amount_sum em").text(count);

        //遍历总价框
          $(".total").each(function (index,ele) {
              totalMoney+= parseFloat($(ele).text().slice(1))
          });

          $(".price_sum em").text("￥"+totalMoney.toFixed(2));
      }

      //7.删除当前的行
    $(".del a").click(function () {
        $(this).parent().parent().remove();
        getSum();
    });

    //8.删除选中的订单
    $(".delRow").click(function () {
        $(".ck:checked").parent().parent().remove();
        getSum();
    });

    //9.删除所有订单
    $(".delAll").click(function () {
        $("tbody").empty();//删除自身所有子元素
        getSum();
    });









})